import sectionTitle from '@/components/section-title'
	import {
		fetchCategoryInfo
	} from '@/api/index'
	import {
		queryHotArticles,
		queryToppingArticles,
		queryTJpage
	} from '@/api/articles'
	import Feature from '@/components/feature'
	import Post from '@/components/post'
	import advertisement from '@/components/advertisement/advertisement'
	import categoryNav from '@/components/category/category_nav.vue'
	import {
		queryById,
		queryOneLevelCategory,
		offspringArticle,
		toppingArticles
	} from '@/api/mainCategory.js'
	import {
		queryPageListByLevel
	} from '@/api/category.js'
	import {
		queryArticlesBOLC,
	} from '@/api/blog.js'
	export default {
		name: "Articles",
		data() {
			return {
				categoryInfo: {},
				hotArticles: [],
				toppingArticles: [],
				TJArticles: {
					data: []
				},
				currPage: 1,
				pageSize: 6,
				//分类导航相关的数据
				categoryNav: {
					pageSize: 5,
					categoryNavs: [],
					total: 0,
					currPage: 1
				},
				articles_title: "最新博文",
				categoryId: 0,
				mobile: {
					categoryNavDrawer: false,
					article: {
						pageNo: 1,
						pageSize: 10
					},
					TJArticles: [],
					categoryId: 0,
					articles_title: "推荐博文"
				}
			}
		},
		components: {
			Feature,
			sectionTitle,
			Post,
			advertisement,
			categoryNav
		},
		methods: {
			handleSizeChange2(val) {
				this.queryPageListByLevel(this.$route.params.id, val);
			},
			getHotArticles() {
				queryHotArticles().then(res => {
					this.hotArticles = res.data;
				})
			},
			getToppingArticles(id) {
				toppingArticles(id).then(res => {
					this.toppingArticles = res.data;
				})
			},
			getTJpage(id, pageNo) {
				offspringArticle(id, pageNo, this.pageSize).then(res => {
					this.TJArticles = res.data;
				})
			},
			getTJpage2(id, pageNo) {
				offspringArticle(id, pageNo, this.mobile.article.pageSize).then(res => {
					this.mobile.TJArticles = res.data.data;
				})
			},
			handleSizeChange(val) {
				if (this.categoryId == 0) {
					this.getTJpage(this.$route.params.id, val);
				} else {
					var data = {
						pageNo: val,
						pageSize: this.pageSize,
						id: this.categoryId
					}
					queryArticlesBOLC(data).then(res => {
						this.TJArticles = res.data
					}).catch(err => {
						console.log(err)
					})
				}
			},
			mainCategoryInfo(id) {
				queryById(id).then(res => {
					this.categoryInfo = res.data;
				})
			},
			queryPageListByLevel(id, pageNo) {
				queryOneLevelCategory(id, pageNo, this.categoryNav.pageSize).then(res => {
					this.categoryNav.categoryNavs = res.data.data;
					this.categoryNav.total = res.data.total;
					console.log(this.categoryNav.total)
				})
			},
			activeFun(id, name) {
				this.currPage = 1;
				this.categoryId = id;
				this.articles_title = "“" + name + "”分类的文章";
				var data = {
					pageNo: 1,
					pageSize: this.pageSize,
					id: id
				}
				queryArticlesBOLC(data).then(res => {
					this.TJArticles = res.data
				})
			},
			activeFun2(id, name) {
				if (this.mobile.categoryNavDrawer) {
					this.mobile.categoryNavDrawer = false;
				}
				this.mobile.categoryId = id;
				this.mobile.articles_title = "“" + name + "”分类的文章";
				var data = {
					pageNo: 1,
					pageSize: this.mobile.article.pageSize,
					id: id
				}
				queryArticlesBOLC(data).then(res => {
					this.mobile.TJArticles = res.data.data || []
				})
				this.mobile.article.pageNo = 1;
			},
			articleLoadMore() {
				this.mobile.article.pageNo++;
				var article = this.mobile.article;
				if (this.mobile.categoryId == 0) {
					offspringArticle(this.$route.params.id,article.pageNo, article.pageSize).then(res => {
						var data = res.data.data;
						for (var k in data) {
							this.mobile.TJArticles.push(data[k]);
						}
					})
				} else {
					var data = {
						pageNo: article.pageNo,
						pageSize: article.pageSize,
						id: this.mobile.categoryId
					}
					queryArticlesBOLC(data).then(res => {
						var data1 = res.data.data;
						for (var k in data1) {
							this.mobile.TJArticles.push(data1[k]);
						}
					}).catch(err => {
						console.log(err)
					})
				}
			},
			ref() {
				this.currPage = 1;
				this.categoryId = 0;
				this.articles_title = "最新博文";
				this.getTJpage(this.$route.params.id, 1);
				this.$refs.child.cancelStyle();
			},
			ref2() {
				this.mobile.article.pageNo = 1;
				this.mobile.categoryId = 0;
				this.mobile.articles_title = "推荐文章";
				this.$refs.child2.cancelStyle();
				this.getTJpage2(this.$route.params.id, 1);
			}
		},
		watch: {
			$route: {
				handler: function(val, oldVal) {
					this.mainCategoryInfo(val.params.id);
					this.queryPageListByLevel(val.params.id, 1);
					this.getTJpage(val.params.id, 1);
					this.getToppingArticles(val.params.id);
					//this.ref();
					this.currPage = 1;
					this.categoryId = 0;
					this.articles_title = "最新博文";
					this.getTJpage(this.$route.params.id, 1);
				}
			}
		},
		mounted() {
			this.getHotArticles();
			this.getTJpage(this.$route.params.id, 1);
			this.getTJpage2(this.$route.params.id, 1);
			this.mainCategoryInfo(this.$route.params.id);
			this.queryPageListByLevel(this.$route.params.id, 1);
		},
		created() {
			this.getToppingArticles(this.$route.params.id);
		},
		//页面创建之初自动触发的事件
		beforeCreate() {
			this.$bus.emit("setIdx", 1);
			this.$bus.emit("setIndexId", this.$route.params.id);
		}
	}